$form-prefix-cls: "#{$css-prefix}form-gird";
$form-item-prefix-cls: "#{$form-prefix-cls}-item";

.#{$form-prefix-cls} {
    .#{$form-item-prefix-cls}-label {
        text-align: right;
        vertical-align: middle;
        float: left;
        font-size: $font-size-small;
        color: $text-color;
        line-height: 1;
        // padding: 10px 12px 10px 0;
        padding: $form-gird-label-padding;
        box-sizing: border-box;
        // 多余即省略
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    &-label-left .#{$form-item-prefix-cls}-label {
        text-align: left;
    }
    &-label-top .#{$form-item-prefix-cls}-label {
        float: none;
        display: inline-block;
        padding:$form-gird-label-top-padding;
    }
    &-inline{
        .#{$form-item-prefix-cls} {
            display: inline-block;
            margin-right: $form-gird-inline-margin-right;
            vertical-align: top;
        }
    }
    &-row {
        @include clearfix();
        .#{$form-item-prefix-cls} {
            display: block;
            float: left;
            padding: $form-gird-row-padding;
            margin: 0;
            &-required {
                .#{$form-item-prefix-cls}-requiredIcon {
                    left: -3px;
                }
            }
            &-content {
                // height: 32px;
                line-height: $form-gird-row-content-line-height;

            }
        }
        .h-col {
            .#{$form-item-prefix-cls} {
                padding: 0;
                &-required {
                .#{$form-item-prefix-cls}-requiredIcon {
                    left: $form-gird-row-content-requiredIcon-left;
                }
            }
            }
        }
        @include make-form-grid(form);
        @include make-form-grid(form,form-item);

        // @include make-form-grid('form', 'formItem');
    }
}

.#{$form-item-prefix-cls} {
    margin-bottom: $form-gird-item-margin-bottom;
    vertical-align: top;
    @include clearfix();
    &-content {
        position: relative;
        line-height: $form-gird-item-line-height;
        font-size: $font-size-small;
    }
    & & {
        margin-bottom: 0;
    }
    & & &-content {
        margin-left: 0!important;
    }

    &-error-tip{
        position: absolute;
        top: 100%;
        left: 0;
        line-height: 1;
        padding-top: $form-gird-item-error-tip-padding-top;
        color: $error-color;
    }

    &-required {
        position: relative;
        .#{$form-item-prefix-cls}-label:before {
            content: '*';
            display: inline-block;
            margin-right: $form-gird-item-required-margin-right;
            line-height: 0;
            font-family: SimSun;
            font-size: $font-size-small;
            color: $error-color;
        }
        .#{$form-item-prefix-cls}-requiredIcon {
            display: inline-block;
            position: absolute;
            left: $form-gird-item-requiredIcon-left;
            vertical-align: middle;
            line-height: $form-gird-item-requiredIcon-height;
            height: $form-gird-item-requiredIcon-height;
            color: $error-color;
            font-family: SimSun;
            font-size: $font-size-small;
        }
    }
    // &.#{$form-item-prefix-cls}-reqNoLabel{
    //     padding-right: 15px;
    // }
    &-error {
        // todo
    }
}
